<style lang="less" scoped>
.page {
}
</style>

<template>
  <div class="page">
    <!-- tab -->
    <scroll-bar v-if="tabs.length>1" :tabs="tabs" :activeIndex="activeIndex" @indexChange="indexChange"></scroll-bar>
    <!-- content -->
    <template v-for="(item, index) in items" wx:key="unique">
      <panel v-if="!item.length" :item="item" :key="index"></panel>
      <panels v-else :item="item" :key="index"></panels>
    </template>
  </div>
</template>

<script>
import Panel from './Panel';
import Panels from './Panels';
import ScrollBar from '@/components/ScrollTab';

export default {
  components: {
    Panel,
    Panels,
    ScrollBar
  },
  data() {
    return {
      activeIndex: 0,
      tabs: [],
      items: [],
      lists: []
    };
  },
  onShow() {
    const pathName = this.$route.query.pathName;
    console.log(pathName);

    try {
      delete require.cache[require.resolve(`./map/${pathName}`)]; // 清除缓存
      const res = require(`./map/${pathName}`).default;

      //兼容处理
      if (Array.isArray(res)) {
        this.items = res;
      } else {
        this.items = res.items;
        this.tabs = res.tabs;
      }
    } catch (error) {
      this.items = [];
      wx.showToast({
        title: '无数据',
        icon: 'none',
        duration: 1000,
        mask: true
      });
    }
  },
  methods: {
    indexChange(index) {
      // tab及内容索引改变
      this.activeIndex = index;
    }
  }
};
</script>
